.tableOptions {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.tableOptions:after {
  content: "";
  flex: auto;
}

.inputItem {
  span {
    padding-right: .8rem;
    float: left;
    line-height: 32px;
  }
  input {
    width: auto;
    border-radius: 4px;
  }
}

.error {
  background-color: red;
  background: red;
  transition: all .2s;
  border: 1px solid red;
  &:focus {
    background-color: red;
    background: red;
    border: 1px solid red;
  }
  &:hover {
    background-color: red;
    opacity: 0.6;
    background: red;
    border: 1px solid red;
  }
}

.normal {
  background-color: #1890ff;
  background: #1890ff;
  transition: all .2s;
  border: 1px solid #1890ff;
  &:focus {
    background-color: #1890ff;
    background: #1890ff;
    border: 1px solid #1890ff;
  }
  &:hover {
    background-color: #1890ff;
    opacity: 0.6;
    background: #1890ff;
    border: 1px solid #1890ff;
  }
}


.add {
  background-color: #20e4a6;
  background: #20e4a6;
  transition: all .2s;
  border: 1px solid #20e4a6;
  &:focus {
    background-color: #20e4a6;
    background: #20e4a6;
    border: 1px solid #20e4a6;
  }
  &:hover {
    background-color: #20e4a6;
    opacity: 0.6;
    background: #20e4a6;
    border: 1px solid #20e4a6;
  }
}